<template>
  <!-- 
  志愿者组件
 -->
  <div>
    <volunteermain v-if="'showMain' === show" @showSon="showSon" @Form="showForm"/>
    <volunteerson  v-if="'showSon' === show" @showSon="showSon" :msg="msg"/>
    <volunteerform v-if="'showForm' === show"  @FormMain="formMain"/>
  </div>
</template>

<script>
import volunteermain from "./VolunteerMain/index";
import volunteerson from "./VolunteerSon/index";
import volunteerform from "./VolunteerForm/index";

export default {
  data() {
    return {
      show: "showMain",
      msg:null
    };
  },
  components: {
    volunteermain,
    volunteerson,
    volunteerform,
  },
  methods: {
    showSon(...e){
      this.show = e[0],
      this.msg = e[1]
    },
    showForm(e){
      this.show = e
    },
    formMain(e){
      this.show = e
    }
  },
};
</script>